<template>
  <div>
    <el-dialog
      v-model="dialogVisible"
      width="80%"
      align-center
      :show-close="false"
      destroy-on-close
      draggable
    >
      <template #header="{ close }">
        <div class="dialog-header flex justify-between items-center">
          <div>项目变更审核</div>
          <el-icon class="el-icon--left cursor-pointer" @click="close"
            ><CircleCloseFilled color="#fff"
          /></el-icon>
        </div>
      </template>
      <ChangeInfo :operateId="operateId" v-if="projectClass != 'yfContract'" />
      <YfChangeInfo :operateId="operateId" v-else />
      <template #footer>
        <div class="dialog-footer">
          <Checkcomponents :procInsId="procInsId" class="mt-[10px]" @success="checkSuccess" />
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script setup>
import Checkcomponents from "@/views/flowable/processInstance/detail/components.vue";
import ChangeInfo from "./ChangeInfo.vue"; //校级和纵向
import YfChangeInfo from "@/views/project/yf/jzhtbg/components/ChangeInfo.vue"; //横向
const dialogVisible = ref(false);
const operateId = ref(null);
const projectClass = ref("");
const procInsId = ref(null); //流程实例id
//审核
const check = (id, proClass, processId) => {
  operateId.value = id;
  projectClass.value = proClass;
  procInsId.value = processId;
  dialogVisible.value = true;
};
defineExpose({ check });
const emit = defineEmits(["check-success"]);
const checkSuccess = () => {
  dialogVisible.value = false;
  emit("check-success");
};
</script>

<style scoped lang="scss">
@import url("@/views/project/index.scss");
:deep(.el-dialog__body) {
  height: calc(100% - 180px);
}
</style>
